<template>
  <div class="tree" style="width:100%">
    <el-row type="flex" justify="space-between" style="width:100%">
      <el-col class="left"
        ><i class="el-icon-s-home"></i>{{ item.name }}</el-col
      >
      <el-col class="right">
        <div style="text-align: right">
          <span>{{ item.manager }}</span>
          <el-dropdown class="myDown">
            <span class="el-dropdown-link">
              操作<i class="el-icon-arrow-down el-icon--right"></i>
            </span>
            <el-dropdown-menu slot="dropdown">
              <el-dropdown-item>添加子部门</el-dropdown-item>
              <el-dropdown-item v-if="!isTop">查看部门</el-dropdown-item>
              <el-dropdown-item v-if="!isTop">删除部门</el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
        </div>
      </el-col>
    </el-row>
  </div>
</template>

<script>
export default {
  props: ['item', 'isTop']
}
</script>

<style lang="scss" scoped>
.tree {
  .left {
    font-size: 14px;
    font-weight: 700;
    i {
      margin-right: 10px;
    }
  }
  .right {
    font-size: 14px;
    .myDown {
      margin-left: 20px;
    }
  }
}
</style>
